<template>
    <ul class="left-nav">
      <li><svg class="icon" aria-hidden="true"><use xlink:href="#icon-goumai"></use></svg><p>收银</p></li>
      <li><svg class="icon" aria-hidden="true"><use xlink:href="#icon-dianpu"></use></svg><p>店铺</p></li>
      <li><svg class="icon" aria-hidden="true"><use xlink:href="#icon-hanbao"></use></svg><p>商品</p></li>
      <li><svg class="icon" aria-hidden="true"><use xlink:href="#icon-huiyuanqia"></use></svg><p>会员</p></li>
      <li><svg class="icon" aria-hidden="true"><use xlink:href="#icon-zuanshi"></use></svg><p>统计</p></li>
      <li><svg class="icon" aria-hidden="true"><use xlink:href="#icon-gongnengjianyi"></use></svg><p>设置</p></li>
    </ul>
</template>

<script>
export default {
  name: 'commonMenu',
  data () {
    return {

    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="less">
  .left-nav{
    color: #fff;
    font-size: 10px;
    height: 100%;
    background-color:#1D8CE0;
    float: left;
    width: 5%;
    text-align: center;
    padding-top: 60px;
    li{
      margin-bottom: 10px;
      p{
        margin: 5px;
      }
    }
    .icon{
      width: 3em;
      height: 3em;
    }
  }
</style>
